<!DOCTYPE HTML>
<html>
  <head>
    <style>
      body {
        margin: 0px;
        padding: 0px;
      }
      canvas {
        border: 1px solid #9C9898;
      }
    </style>
  </head>
  <body>
    <div id="container"></div>

    <script src="../../dist/konva-dev.js"></script>
    <script src="../lib/stats.js"></script>
    <script src="../setStats.js"></script>

    <script>



      var stage = new Konva.Stage({
        container: 'container',
        width: 500,
        height: 500
      });
      var layer = new Konva.Layer();

      var star = new Konva.Star({
          x: 250,
          y: 250,
          innerRadius: 100,
          outerRadius: 200,
          numPoints: 500,
          fill: 'yellow',
          stroke: 'black',
          strokeWidth: 4,
          name: 'myCircle',
          draggable: true
      });

      layer.add(star);
      stage.add(layer);

      var anim = new Konva.Animation(function() {
        stats.begin();
        star.rotate(0.1);
      }, layer);

      star.cache({
        x: -204,
        y: -204,
        width: 408,
        height: 408
      }).offsetX(204).offsetY(204);

      anim.start();

    </script>
  </body>
</html>